import { Button, Tooltip } from 'antd';
import { Fragment } from 'react';
import { EditOutlined, EyeOutlined, CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons';
import { ManageCommonAPI } from '@/pages/type';
import pageStyles from '@/common/pageLayout.less';
import { history } from 'umi';
import { fieldFlowExport, getColorTextLoadMap, getKeyRouter, getTenantID } from '@/utils';
import MyIcon from '@/components/MyIcon';
import { tableMoreBtnConfig } from '@/utils/myutilConfig';
import { AssetacquisitionManageAPI } from '../common/type';

/**操作按钮的显示*/
const Operation = (curRes: Record<string, any>, operateFuns: AssetacquisitionManageAPI.IMaterialTableActionType, record: Record<string, any>) => {
  let operationArray: any = [];

  /** 一个按钮都没有时展示*/
  const Disable = (
    <Fragment key={record?.id + '--Disable'}>
      <Button style={{ color: '#000' }} className="manageBtntTxtStyle" type={'link'} size={'small'} disabled>
        --
      </Button>
    </Fragment>
  );

  /** 更多按钮配置 */
  const otherBtnConfig: ManageCommonAPI.TableMoreBtnConfigApi[] = [
    {
      icon: <EditOutlined />,
      btnName: '编辑',
      clickFnc: operateFuns,
      clickType: 'onEdit',
      isVisible: true,
      // 没有审批状态 并且 申请状态在起草  显示可以编辑
      // isVisible:
      //   curRes?.['/assetApply/storage/edit'] && !record?.checkState && record?.applyState == `${getTenantID()}${ILoadMapTypeAll.STORAGE_INSPECTION_STATUS}1000`,
    },
    {
      icon: <CheckCircleOutlined />,
      btnName: '提交',
      clickFnc: operateFuns,
      clickType: 'onSubmit',
      // 没有审批状态 并且 申请状态在起草  显示可以提交
      // isVisible:
      //   curRes?.['/assetApply/storage/startProcess'] &&
      //   !record?.checkState &&
      //   record?.applyState == `${getTenantID()}${ILoadMapTypeAll.STORAGE_INSPECTION_STATUS}1000`,
      isVisible: true,
    },
    {
      icon: <CloseCircleOutlined style={{ color: 'red' }} />,
      btnName: <span style={{ color: 'red' }}>作废</span>,
      clickFnc: operateFuns,
      clickType: 'onCancel',
      isVisible: true,
      // isVisible:
      //   curRes?.['/assetApply/storage/cancel'] &&
      //   !record?.checkState &&
      //   record?.applyState == `${getTenantID()}${ILoadMapTypeAll.STORAGE_INSPECTION_STATUS}1000`,
    },
  ];
  const ohterBtn = tableMoreBtnConfig(otherBtnConfig, record);
  operationArray = ohterBtn;
  operationArray = operationArray?.filter((itemBtn: any) => itemBtn);
  return operationArray && operationArray?.length > 0 ? operationArray : [Disable];
};

// Table表格的配置
const getTableColumns = (curRes: Record<string, any>, operateFuns: AssetacquisitionManageAPI.IMaterialTableActionType) => {
  const { onView } = operateFuns;
  return [
    {
      title: '承办部门/团队',
      dataIndex: 'createDepartmentName',
      key: 'createDepartmentName',
      fixed: 'left',
      width: 150,
      unDrag: true,
      visible: true,
      sorter: (a: any, b: any) => (a?.applyInfo > b?.applyInfo ? 1 : -1),
      render: (text: string, record: any) => {
        return (
          <Tooltip title={text}>
            <div className={pageStyles['over-flow-hidden']}>{text || '--'}</div>
          </Tooltip>
        );
      },
    },
    {
      title: '事项名称',
      dataIndex: 'applyTitle',
      key: 'applyTitle',
      fixed: 'left',
      width: 150,
      unDrag: true,
      visible: true,
      sorter: (a: any, b: any) => (a?.applyInfo > b?.applyInfo ? 1 : -1),
      render: (text: string, record: any) => {
        return (
          <Tooltip title={text}>
            <a onClick={() => onView(record)}>{text || '--'}</a>
          </Tooltip>
        );
      },
    },
    {
      title: '退库说明',
      dataIndex: 'applyInfo',
      key: 'applyInfo',
      fixed: 'left',
      width: 150,
      unDrag: true,
      visible: true,
      sorter: (a: any, b: any) => (a?.applyInfo > b?.applyInfo ? 1 : -1),
      render: (text: string) => {
        return (
          <Tooltip title={text}>
            <div className={pageStyles['over-flow-hidden']}>{text || '--'}</div>
          </Tooltip>
        );
      },
    },
    {
      title: '退库状态',
      dataIndex: 'applyStateName',
      key: 'applyStateName',
      width: 150,
      unDrag: true,
      visible: true,
      sorter: (a: any, b: any) => (a?.applyStateName > b?.applyStateName ? 1 : -1),
      render: (text: number) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip>
            <MyIcon type="icon-dian" style={{ color: color }} />
            <span style={{ color: color }}>{colorText ? colorText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '审核状态',
      dataIndex: 'checkStateName',
      key: 'checkStateName',
      width: 150,
      unDrag: true,
      visible: true,
      sorter: (a: any, b: any) => (a?.checkStateName > b?.checkStateName ? 1 : -1),
      render: (text: string) => {
        let colorText = getColorTextLoadMap(text)?.colorText;
        let color = getColorTextLoadMap(text)?.color;
        return (
          <Tooltip>
            <MyIcon type="icon-dian" style={{ color: color }} />
            <span style={{ color: color }}>{colorText ? colorText : '--'}</span>
          </Tooltip>
        );
      },
    },
    {
      title: '操作',
      dataIndex: 'operation',
      key: 'operation',
      width: 230,
      visible: true,
      unDrag: true,
      align: 'center',
      fixed: 'right',
      render: (text: string | null, record: Record<string, any>) => {
        return <div style={{ display: 'flex' }}>{Operation(curRes, operateFuns, record)}</div>;
      },
    },
  ];
};

export { getTableColumns };
